<template>
  <div class="app-container">
    <el-tabs v-model="activeName" type="border-card">
      <el-tab-pane label="邮箱分组" name="grouping">
        <Grouping v-if="activeName === 'grouping'" />
      </el-tab-pane>
      <el-tab-pane label="导入邮箱" name="importNum">
        <ImportNum v-if="activeName === 'importNum'" />
      </el-tab-pane>
      <el-tab-pane label="派码记录" name="assignNumber">
        <AssignNumber v-if="activeName === 'assignNumber'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script setup>
import Grouping from "./grouping/index.vue";
import ImportNum from "./importNum/index.vue";
import AssignNumber from "./assignNumber/index.vue";
import useToggle from "@/hooks/useToggle";
const [activeName, _] = useToggle("grouping");
</script>
